<template>
  <div class="w-full">
    <Hero />

    <main class="max-w-[1200px] mx-auto px-4 lg:px-8 space-y-10 pb-12">
      <HotRoles />
      <Categories />
      <GuideBanner />
    </main>
  </div>
</template>

<script setup lang="ts">
import { onMounted } from 'vue'
import Hero from '@/components/index/Hero.vue'
import HotRoles from '@/components/index/HotRoles.vue'
import Categories from '@/components/index/Categories.vue'
import GuideBanner from '@/components/index/GuideBanner.vue'

onMounted(() => {
  console.log('首页组件挂载')
})
</script>
